<!DOCTYPE html>
<html>
<head>
    <title>推广结算信息表</title>
	<#include "/header.html">
    <script src="${request.contextPath}/statics/libs/layer.js"></script>
    <style>
        th, td{
            text-align: center;
        }

        ul.nav-pills {
            margin-top: 5px;
        }

        ul.nav-pills>li {
            cursor: pointer;
        }

        .nav-box{
            display: none;
            padding-top: 8px;
        }
    </style>
</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
            <div style="float: left">
                <input style="width: 120px" type="text" class="form-control" v-model="q.userId" @keyup.enter="query" placeholder="用户id">
            </div>
            <a class="btn btn-default" @click="query">查询</a>
            <#if shiro.hasPermission("sys:buserpromotionsettleinfo:save")>
            <a class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
            </#if>
        </div>
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>

    <div v-show="!showList" class="panel panel-default">
        <nav class="navbar navbar-default navbar-fixed-top">
            <div class="container">
                <ul class="nav nav-pills">
                    <li role="presentation" class="active"><a href="###">个人信息</a></li>
                    <li role="presentation"><a href="###" id="tab_invite_income">佣金变动明细</a></li>
                    <li role="presentation"><a href="###" id="tab_withdraw_log">用户提现记录</a></li>
                </ul>
            </div>
        </nav>
        <div class="panel-heading">{{title}}</div>
        <div class="nav-box" style="display: block">
            <form class="form-horizontal">
                <div class="form-group">
                    <div class="col-sm-2 control-label">用户ID</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="current_userId" v-model="bUserPromotionSettleInfo.userId" placeholder="用户ID" />
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">一级分成比例</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.firstLevelProportion" placeholder="一级分成比例，10即表示10%"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">二级分成比例</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.secondLevelProportion" placeholder="二级分成比例，5即表示5%"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">三级分成比例</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.thirdLevelProportion" placeholder="三级分成比例"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">四级分成比例</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.fourthLevelProportion" placeholder="四级分成比例"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">五级分成比例</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.fifthLevelProportion" placeholder="五级分成比例"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">累计抵扣佣金</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.allBrokerage" placeholder="累计收入"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">累计收入</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.cumulativeIncome" placeholder="累计收入"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">一级累计收入</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.firstLevelCumulativeIncome" placeholder="一级累计收入"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">二级累计收入</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.secondLevelCumulativeIncome" placeholder="二级累计收入"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">三级累计收入</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.thirdLevelCumulativeIncome" placeholder="三级累计收入"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">四级累计收入</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.fourthLevelCumulativeIncome" placeholder="四级累计收入"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">五级累计收入</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.fifthLevelCumulativeIncome" placeholder="五级累计收入"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">已结算收入</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.settledIncome" placeholder="已结算收入"/>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-2 control-label">渠道描述</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.settleDesc" placeholder="渠道描述"/>
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-sm-2 control-label">用户余额</div>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" v-model="bUserPromotionSettleInfo.accountBalance" placeholder="用户余额"/>
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-sm-2 control-label"></div>
                    <input type="button" class="btn btn-primary" @click="saveOrUpdate" value="确定"/>
                    &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
                </div>
            </form>
        </div>

        <div class="nav-box">
            <table id="jqGridIncome"></table>
            <div id="jqGridPagerIncome"></div>
            佣金变动明细
        </div>
        <div class="nav-box">
            <table id="jqGridWithdraw"></table>
            <div id="jqGridPagerWithdraw"></div>
            用户提现记录
        </div>
    </div>

    <div v-show="!addPay" id="addPay" class="panel panel-default">
        <form class="form-horizontal">
            <div class="form-group">
                <div class="col-sm-2 control-label">用户ID</div>
                <div class="col-sm-5">
                    <input type="text" id="userId" v-model="bUserPromotionPaymentInfo.userId" class="form-control"  placeholder="用户Id" readonly="readonly"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">支付金额</div>
                <div class="col-sm-5">
                    <input id="paymentAmount" v-model="bUserPromotionPaymentInfo.paymentAmount" class="form-control" onblur=vm.getValue(this)></input>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label"></div>
                <input type="button" class="btn btn-primary" onclick="vm.payAdd()" value="确定"/>
                &nbsp;&nbsp;<input type="button" class="btn btn-warning" onclick="vm.closeAll()" value="关闭"/>
            </div>
        </form>
    </div>
    <div v-show="!imgdow" id="imgdow" class="panel panel-default">
        <form class="form-horizontal" style="width: 350px">
            <div class="form-group">
                <div class="col-sm-2 control-label"></div>
                <div class="col-sm-5">
                    <img src="" id="wechat" style="width: 200px;height: 200px">
                </div>
            </div>
        </form>
    </div>
    <form class="form-horizontal" v-show="!tuiguan" id="tuiguang">
        <div class="form-group">
            <div class="col-sm-2 control-label">用户ID</div>
            <div class="col-sm-5">
                <input type="text" id="user" />
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-2 control-label">加密</div>
            <div class="col-sm-5">
                <input type="text" id="jiami" class="form-control" />
            </div>
        </div>
    </form>
</div>
<script src="${request.contextPath}/statics/js/modules/sys/buserpromotionsettleinfo.js?_${.now?long}"></script>
<script>
    //④点击事件下载（只需更改图片路径即可）

    function payAdd(){
        console.log($("#paymentAmount").val())
    }
</script>
<script>
    $('ul.nav-pills>li').on('click', function () {
        $(this).addClass('active').siblings('.active').removeClass('active');
        // 获取索引
        let index = $(this).index('ul.nav-pills>li');
        console.info(index);
        // 隐藏掉内容
        $(".nav-box").fadeOut("slow");
        // 显示出当前的p标签
        $('.nav-box').eq(index).fadeIn("slow");

        console.info("${request.contextPath}");

        let currentUserId = $("#current_userId").val();
        if (index == 1) {
            $("#jqGridIncome").jqGrid({
                url: baseURL + 'sys/buserinviteincomeinfo/info',
                datatype: "json",
                colModel: [
                    {label: '用户ID', name: 'userId', index: 'user_id', align: "center", width: 70},
                    {label: '变动前余额(元)', name: 'beforeBalance', index: 'before_balance', align: "center", width: 70},
                    {label: '变动后余额(元)', name: 'afterBalance', index: 'after_balance', align: "center", width: 70},
                    {label: '来源用户ID', name: 'fromUserId', index: 'from_user_id', align: "center", width: 70},
                    {label: '来源用户昵称', name: 'fromNickName', index: 'from_nick_name', align: "center", width: 120},
                    { label: '来源用户头像', name: 'fromAvatarUrl', index: 'from_avatar_url', width: 80,align: "center", sortable: false, editable: false, formatter: function (value,options,rowData) {
                            var url="https://lktvtool.oss-cn-shenzhen.aliyuncs.com/icon/236A5FF0-52DE-4644-B66C-E9555C97693D.png";
                            if(value==null || value==""){
                                return"<img src='" + url + "' width='60' />";
                            }else {
                                return "<img src='" + value + "' width='60' />";
                            }
                        }},
                    {label: '收入(元)', name: 'income', index: 'income', align: "center", width: 70},
                    {label: '创建时间', name: 'createTime', index: 'create_time', align: "center", width: 100},
                    {label: '计算比例(%)', name: 'levelProportion', index: 'level_proportion', align: "center", width: 70},
                    {label: '计算等级', name: 'level', index: 'level', align: "center", width: 70},
                    {label: '金额基数(元)', name: 'base', index: 'base', align: "center", width: 70},
                ],
                viewrecords: true,
                height: 520,
                rowNum: 15,
                rowList: [15, 30, 50],
                rownumbers: true,
                rownumWidth: 25,
                autowidth: true,
                multiselect: false,
                pager: "#jqGridPagerIncome",
                jsonReader: {
                    root: "page.list",
                    page: "page.currPage",
                    total: "page.totalPage",
                    records: "page.totalCount"
                },
                prmNames: {
                    page: "page",
                    rows: "limit",
                    order: "order"
                },
                postData: {'userId': currentUserId},
                gridComplete: function () {
                    //隐藏grid底部滚动条
                    $("#jqGridIncome").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
                    $("#jqgh_jqGridIncome_cb").css("text-align", "left");
                }
            });

            function reloadIncome(event) {
                $("#jqGridIncome").jqGrid('setGridParam',{
                    postData: {'userId': currentUserId},
                    page: 1
                }).trigger("reloadGrid");
            };

            reloadIncome();
        }

        if (index == 2) {
            $("#jqGridWithdraw").jqGrid({
                url: baseURL + 'sys/buserwithdrawlog/getWithdrawByUserId',
                datatype: "json",
                colModel: [
                    {label: '提现人ID', name: 'userId', index: 'user_id', align: "center", width: 40},
                    // {label: '提现人', name: 'userName', index: 'userName', align: "center", width: 70},
                    {label: '提现前账户余额(元)', name: 'beforeBalance', index: 'before_balance', align: "center", width: 70},
                    {label: '提现后账户余额(元)', name: 'afterBalance', index: 'after_balance', align: "center", width: 70},
                    {label: '申请提现金额(元)', name: 'amount', index: 'amount', align: "center", width: 60},
                    {label: '处理状态', name: 'processStatus', index: 'process_status', align: "center", width: 40, formatter: function (value,options,rowData) {
                            if (value == 1) {
                                return "<p>已打款</p>"
                            } else if (value == 2) {
                                return "<p>已拒绝</p>";
                            } else {
                                return "<p>未处理</p>";
                            }
                        }},
                    // {label: '备注', name: 'remark', index: 'remark', align: "center", width: 120},
                    // {label: '申请提现类型', name: 'applyType', index: 'apply_type', align: "center", width: 70, formatter: function (value,options,rowData) {
                    //         if (value == 1) {
                    //             return "<p>邀请收入提现</p>"
                    //         } else {
                    //             return "";
                    //         }
                    //     }},
                    // {label: '商户转账唯一订单号', name: 'outBizNo', index: 'out_biz_no', align: "center", width: 100},
                    // {label: '支付宝转账单据号', name: 'orderId', index: 'order_id', align: "center", width: 70},
                    {label: '申请时间', name: 'createTime', index: 'create_time', align: "center", width: 70},
                    {label: '账号名', name: 'fullName', index: 'full_name', align: "center", width: 40},
                    {label: '开户银行', name: 'bankName', index: 'bank_name', align: "center", width: 60},
                    {label: '开户支行全称', name: 'subBranch', index: 'sub_branch', align: "center", width: 120},
                    {label: '银行账号', name: 'bankAccount', index: 'bank_account', align: "center", width: 80},
                    {label: '手机号', name: 'phone', index: 'phone', align: "center", width: 60},
                ],
                viewrecords: true,
                height: 520,
                rowNum: 15,
                rowList: [15, 30, 50],
                rownumbers: true,
                rownumWidth: 25,
                autowidth: true,
                multiselect: false,
                pager: "#jqGridPagerWithdraw",
                jsonReader: {
                    root: "page.list",
                    page: "page.currPage",
                    total: "page.totalPage",
                    records: "page.totalCount"
                },
                prmNames: {
                    page: "page",
                    rows: "limit",
                    order: "order"
                },
                postData: {'userId': currentUserId},
                gridComplete: function () {
                    //隐藏grid底部滚动条
                    $("#jqGridWithdraw").closest(".ui-jqgrid-bdiv").css({"overflow-x": "hidden"});
                    $("#jqgh_jqGridWithdraw_cb").css("text-align", "left");
                }
            });

            function reloadWithdraw(event) {
                $("#jqGridWithdraw").jqGrid('setGridParam',{
                    postData: {'userId': currentUserId},
                    page: 1
                }).trigger("reloadGrid");
            };

            reloadWithdraw();
        }
    });
</script>
</body>
</html>
